<template>
  <lay-layout class="Pop">
 
  
   
 
   <lay-body  >
     <lay-form :model="model" ref="layFormRef" class="MainForm" >       
      

      <lay-form-item label="名称" prop="name" required>
<lay-input v-model="model.name" placeholder=""></lay-input>
</lay-form-item>

<lay-form-item label="启动类型" prop="lx" required>
  <lay-select v-model="model.lx" :items="lxItems"
    placeholder="请选择"
    @change="lxChange">             
          </lay-select>
</lay-form-item>


<lay-form-item label="排序号" prop="sortno" >
<lay-input v-model="model.sortno" placeholder=""></lay-input>
</lay-form-item>



<lay-form-item label="参数1名称" prop="p1Name" >
<lay-input v-model="model.p1Name" placeholder=""></lay-input>
</lay-form-item>

<lay-form-item label="参数2名称" prop="p2Name" >
<lay-input v-model="model.p2Name" placeholder=""></lay-input>
</lay-form-item>

<lay-form-item label="参数3名称" prop="p3Name" >
<lay-input v-model="model.p3Name" placeholder=""></lay-input>
</lay-form-item>

<lay-form-item label="参数4名称" prop="p4Name" >
<lay-input v-model="model.p4Name" placeholder=""></lay-input>
</lay-form-item>

<lay-form-item label="备份Sql" prop="bkSql" >
<lay-textarea v-model="model.bkSql" placeholder=""></lay-textarea>
</lay-form-item>

<lay-form-item label="执行Sql" prop="runSql" required>
<lay-textarea v-model="model.runSql" placeholder=""></lay-textarea>
</lay-form-item>




 
 
           </lay-form>
     </lay-body>
 
 
 
     <lay-footer>
      
       <lay-button size="sm" type="primary" @click="toSubmit"
             >保存</lay-button
           >
           <lay-button size="sm" @click="toCancel" style="margin-left:40px;">取消</lay-button>
     </lay-footer>
   </lay-layout>
 
 </template>
 
 <script lang="ts">
 import { ref, watch,reactive,onMounted,h } from 'vue'
 import { layer } from '@layui/layer-vue'
 import MyHttp from "../../library/MyHttp";  
 import MyWin from "../../library/MyWin"; 
 import MyPage from "../../library/MyPage"; 
 import {MyExcel} from "../../library/MyExcel"; 
 import {MySimpleExport,TableColumn} from "../../library/MySimpleExport"; 
 import MyData from "../../library/MyData";  
  
 
 export default {
   props:{
       data:Object,
       isAdd:Boolean
   },
  
 
   setup(prop:any, context:any) {
     const baseUrl="/htsql";
     const myWin=ref<any>(null);
     const model = reactive<any>(prop.data )
     const layFormRef = ref<any>()     
     const toSubmit=async()=>{
       layFormRef.value.validate((isValidate:boolean, model:any, errors:Array<any>) => {
           if(!isValidate){
             let msg='';
             errors.forEach(element=>{ 
               msg+=`${element.message}
               `; 
             })
             
             MyWin.alert(msg,{});
             return;
           }
           
           
 
           save();
       });
     } 
     const toCancel=()=>{ 
       context.emit("cancel");  
       myWin.value.close();
     }
     const save=async()=>{
       let url=baseUrl+"/InsertItem";
       if(!prop.isAdd){
         url=baseUrl+"/updateItem";
       }
       var r=await new MyHttp().post(url,model,
         { 
         }
       ); 
       context.emit("ok",model); 
       myWin.value.close();  
     }
 
   
    const lxChange=()=>{
       
    }
    
     onMounted(() =>{  
       
       myWin.value=new MyWin();
       lxChange(); 
     });
 
     
 
     const lxItems=ref([
       
       {label:'查询', value:"查询"},
       {label:'操作', value:"操作"} 
     ])
 
  
 
 
     return {
       model,
       layFormRef,
       toSubmit,
       toCancel, 
       lxItems,
       

       lxChange,
        

     }
   }
 }
 </script>
 <style scoped>
 .Pop .layui-footer,
 .Pop .layui-header {
   height: 50px;
   text-align: center; 
   padding-top:10px;
 }  
 .Pop .layui-body{
   justify-content:start;
 }
 .MainForm{
   margin: 0px;
   width:95%;
   margin-top:10px;
 }  
 .w10{
   width:10px;
 } 
 .layui-form-label{
  width:120px;
 }
 </style>